<template>
  <a-card :bordered="false">
    <component @onFeeSum="handleFeeSum" @onFeeCount="handleFeeCount" @onGetCounts="handleGetCounts"
               @onConsumCounts="handleConsumCounts" @onConsumePersonCount="handleConsumePersonCount"
               @onNewPersonCount="handleNewPersonCount"
               @onOldPersonCount="handleOldPersonCount"
               @onGoBack="handleGoBack" :record="record" :is="currentComponet"></component>
  </a-card>
</template>

<script>
// 动态切换组件
import List from './List'
import FeeSumDetail from './FeeSumDetail'
import FeeCountDetail from './FeeCountDetail'
import GetCountsDetail from './GetCountsDetail'
import ConsumCountsDetail from './ConsumCountsDetail'
import ConsumePersonCount from './ConsumePersonCount'
import PersonCount from './PersonCount'

export default {
  name: 'TableListWrapper',
  components: {
    List,
    FeeSumDetail,
    FeeCountDetail,
    GetCountsDetail,
    ConsumCountsDetail,
    ConsumePersonCount,
    PersonCount
  },
  data () {
    return {
      currentComponet: 'List',
      record: ''
    }
  },
  created () {

  },
  methods: {
    handleFeeSum (record) {
      this.record = record || ''
      this.currentComponet = 'FeeSumDetail'
    },
    handleFeeCount (record) {
      // this.record = ''
      // this.currentComponet = 'FeeCountDetail'
    },
    handleGetCounts (record) {
      this.record = record || ''
      this.currentComponet = 'GetCountsDetail'
    },
    handleConsumCounts (record) {
      // this.record = ''
      // this.currentComponet = 'ConsumCountsDetail'
    },
    handleConsumePersonCount (record) {
      this.record = record || ''
      // this.currentComponet = 'ConsumePersonCount'
      this.currentComponet = 'PersonCount'

    },
    handleNewPersonCount (record) {
      this.record = record || ''
      this.currentComponet = 'PersonCount'
    },
    handleOldPersonCount (record) {
      this.record = record || ''
      this.currentComponet = 'PersonCount'
    },
    handleGoBack () {
      this.record = ''
      this.currentComponet = 'List'
    }
  },
  watch: {
    '$route.path' () {
      this.record = ''
      this.currentComponet = 'List'
    }
  }
}
</script>
